<style>
    .table-adminlog tr td {
        word-break: break-all;
    }
</style>
<table class="table table-striped table-adminlog">
    <thead>
    <tr>
        <th width="100">{:__('Title')}</th>
        <th>{:__('Content')}</th>
    </tr>
    </thead>
    <tbody>
    {volist name="row" id="vo" }
    <tr>
        <td>{:__($key)}</td>
        <td>{if $key=='createtime'}
            {$vo|datetime}
            {elseif $key != 'attachments'}
            {$vo|htmlentities}
            {else/}
            {notempty name="vo"}
            {volist name="vo" id="vo1" }
            <image src="{$vo1}" width="100px"  class="thumbnail" onclick="previewImage(`{$vo1}`)" >
            {/volist}
                {/notempty}
            {/if}</td>
    </tr>
    {/volist}
    </tbody>
</table>
<div class="hide layer-footer">
    <label class="control-label col-xs-12 col-sm-2"></label>
    <div class="col-xs-12 col-sm-8">
        <button type="reset" class="btn btn-primary btn-embossed btn-close" onclick="Layer.closeAll();">{:__('Close')}</button>
    </div>
</div>
<style>
        .preview-container {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,0.8);
            z-index: 1000;
            text-align: center;
        }
        .preview-image {
            max-width: 90%;
            max-height: 90%;
            margin-top: 5%;
        }
        .thumbnail {
            cursor: pointer;
            width: 200px;
            height: auto;
            margin: 10px;
        }
    </style>
 <!-- 预览容器 -->
    <div id="previewContainer" class="preview-container" onclick="closePreview()">
        <img id="previewImage" class="preview-image" src="">
    </div>

    <script>
        function previewImage(src) {
            document.getElementById('previewImage').src = src;
            document.getElementById('previewContainer').style.display = 'block';
        }

        function closePreview() {
            document.getElementById('previewContainer').style.display = 'none';
        }
    </script>
